@import "../../css/common";
@import "../../lib/wxParse/wxParse.wxss";

.page-course{
  position: relative;
  width: 100%;
  min-height: 100%;
  padding-top: 353rpx;
  padding-bottom: 120rpx;
  box-sizing: border-box;
  background-color: #474945;

  .course-banner{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 418rpx;
    .banner-item{
      width: 100%;
      height: 100%;
      background-color: #fff;
      image{
        width: 100%;
        height: 100%;
      }
    }
  }

  .course-mainContent{
    position: relative;
    z-index: 2;
    width: 100%;
    box-sizing: border-box;
    padding: 0 31rpx 0 31rpx;
    .main-coachIntro{
      position: relative;
      z-index: 1;
      margin: 0 auto;
      // top: -61rpx;
      // left: 50%;
      // margin-left: -344rpx;
      width: 688rpx;
      // min-height: 442rpx;
      box-sizing: border-box;
      padding: 61rpx 46rpx 0 63rpx;
      border-radius: 10rpx;
      background-color: #fff;
      box-shadow: 0rpx 4rpx 15rpx 0rpx rgba(8, 1, 3, 0.3);
      overflow: hidden;
      .ic-home{
        position: absolute;
        top: 25rpx;
        right: 55rpx;
        font-size: 54rpx;
        color: #ff4907;
      }
      .coachIntro-coachInfo{
        position: relative;
        width: 100%;
        min-height: 175rpx;
        padding-left: 200rpx;
        padding-top: 25rpx;
        box-sizing: border-box;
        border-bottom: 1px solid #c2c2c2;
        .coachInfo-content{
          font-size: 21rpx;
          color: #000;
          line-height: 33rpx;
        }
        .coachInfo-iconWrapper{
          width: 100%;
          text-align: center;
          .ic-more{
            float: right;
            color: #000;
            display: inline-block;
            padding-right: 5rpx;
          }
          .ic-arrow_up{
            padding: 23rpx 0;
            display: inline-block;
            font-size: 23rpx;
            color: #ff4907;
          }
        }
        .coachInfo-avatarArea{
          position: absolute;
          top: 0;
          left: 0;
          width: 122rpx;
          .avatarArea-avatar{
            width: 122rpx;
            height: 122rpx;
            border-radius: 100%;
            border: 1px solid #000;
          }
          .avatarArea-nickname{
            display: block;
            width: 100%;
            text-align: center;
            padding-top: 12rpx;
            font-size: 25rpx;
            color: #000;
          }
        }
      }
      .coachIntro-orderInfo{
        width: 100%;
        box-sizing: border-box;
        padding: 30rpx 0 35rpx 0;
        overflow: hidden;
        .orderInfo-item{
          line-height: 23rpx;
          font-size: 25rpx;
          color: #3d3d3d;
          white-space: nowrap;
          .orderInfo-title{
            color: #000;
            font-weight: bolder;
          }
          .orderAmount-emphasize{
            color: #ff4907;
            font-weight: bold;
          }
          .orderAmount-sales{
            position: relative;
            margin-left: 25rpx;
            .price-line-throught{
              position: absolute;
              top: 30%;
              left: 0%;
              z-index: 2;
              display: inline-block;
              vertical-align: middle;
              width: 100%;
              height: 1px;
              line-height: 1px;
              background-color: #ff4907;
            }
          }
          .ic-location{
            padding-left: 20rpx;
            vertical-align: middle;
            line-height: 23rpx;
            font-size: 36rpx;
            color: #ff4907;
          }
          &+.orderInfo-item{
            margin-top: 21rpx;
          }
        }
      }
    }
    .main-courseIntro{
      width: 100%;
      overflow: hidden;
      padding-bottom: 30rpx;
      font-size: 25rpx;
      color: #fff;
      font-weight: 100;
      line-height:41rpx;
      view{
        word-break:break-all; overflow:auto;
      }
      image{
        width: 100%;
      }
      // .courseIntro-picture{
      //   float: right;
      //   width: 270rpx;
      //   height: 270rpx;
      //   margin-left: 34rpx;
      //   margin-bottom: 37rpx;
      // }
      // .courseIntro-introItem{
      //   font-size: 25rpx;
      //   color: #fff;
      //   font-weight: 100;
      //   line-height:41rpx;
      //   &+.courseIntro-introItem{
      //     margin-top: 55rpx;
      //   }
      // }
    }
  }

  .course-action{
    position: fixed;
    z-index: 990;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 120rpx;
    line-height: 120rpx;
    overflow: hidden;
    font-size: 0;
    white-space: nowrap;
    .action-mainBtn{
      display: inline-block;
      width: 75%;
      text-align: center;
      background-color: #ff4908;
      font-size: 33rpx;
      color: #fff;
    }
    .action-share{
      display: inline-block;
      width: 25%;
      text-align: center;
      background-color: #ff505e;
      font-size: 33rpx;
      color: #fff;
    }
  }
}
